<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="div">
    <h1>用户登录</h1>
    <hr>
    <table border="1px"  style="width: 600px;border-collapse:collapse">
      <tr align="center">
        <td>
         用户名<input type="text" placeholder="请输入用户名" id="user_name" name="user_registe_name" >
        </td>
        </tr>
      <tr align="center">
        <td>
        用户密码<input type="text" placeholder="请输入用户名" id="user_pwd" name="user_registe_pwd" >
      </td>
      </tr>
      <tr align="center">
        <td>
          <input type="button" value="登录" id="login_button">
        </td>
      </tr>
    </table>
  </div>
</body>


<script>
   //点击事件
   login_button.onclick=function(){
     let n=user_name.value;
     let p=user_pwd.value;
     let url='http://127.0.0.1:8081/v1/users/log?username='+n+'&userpwd='+p;
     console.log(url);
     //创建异步请求对象
     let xhr= new XMLHttpRequest();
     //打开服务器连接
     xhr.open('GET',url);
     //接受
     xhr.onload=function(){
       div.innerHTML=xhr.responseText;
     }
     //发送
     xhr.send();
   }
</script>
</html>